import React, { FC } from 'react';
import ReactDOM from 'react-dom';

import { isNullOrUndefined } from '@libs/common';

const COM_PREKEY = 'PortalModal';

interface PortalModalProps {
    isShow: boolean;

    key?: string;

    container?: Element | string;
}

const PortalModal: FC<PortalModalProps> = (props) => {
    if (!props.isShow || isNullOrUndefined(document)) {
        return null;
    }

    const container = props.container ?? document.body;

    return ReactDOM.createPortal(
        props.children,
        typeof container === 'string' ? document.querySelector(container) : container,
        props.key,
    );
};

PortalModal.displayName = 'PortalModal';

export { PortalModal, PortalModalProps };
